<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>药品信息</title>
  <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}" media="all">
  <link rel="stylesheet" th:href="@{/static/admin/style.css}" media="all">
<!--  <script type="text/html" id="indexTp1">-->
<!--    {{a.LAY_TABLE_INDEX+1}}}-->
<!--  </script>-->
</head>
<body class="layui-layout-body">
  <div class="layui-layout-body">
    <div class="layui-fluid">
      <div class="layui-row layui-col-space5">
        <div class="layui-col-md12">
          <div class="layui-card">
            <div class="layui-card-header">药品信息列表</div>
            <div class="layui-card-body">
              <table class="layui-hide" id="main-table" lay-filter="main-table"></table>
              <script type="text/html" id="toolbarDemo">
                <span class="layui-inline" lay-event="add"><i class="layui-icon">&#xe654;</i></span>
                <span class="layui-inline" style="width: 240px">
                  <input class="layui-input" name="param" id="param" placeholder="根据药品名称查询"autocomplete="off">
                </span>
                <span class="layui-btn layui-btn-sm layui-bg-red" lay-event="querySearch">
                  <i class="layui-icon">&#xe615;</i>查询
                </span>
              </script>
              <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
              </script>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <script th:src="@{/static/layui/layui.js}"></script>
  <script>
    layui.use(['form','table','jquery','layer'],function () {
      var form = layui.form;
      var table = layui.table;
      var $ = layui.jquery;
      var layer = layui.layer;

      table.render({
        elem:"#main-table",
        height:650,
        url:"/drugInfo/page",
        method:"POST",
        page:true,
        id:"table-load",
        toolbar:"#toolbarDemo",
        cols:[
          [
          {field: 'id',title:'序号',width:60,align:'center'},
          {field:'name',title:'药品名称',align: 'center'},
          {field:'supplier',title:'供应商',align: 'center'},
          {field:'warranty;',title:'保质期(月)',align: 'center'},
          {field:'number;',title:'药品编码',align: 'center'},
          {field:'price;',title:'药品价格',align: 'center'},
          {field:'stock;',title:'库存',align: 'center'},
          {field:'productdate',title:'创建时间',align: 'center',
          templet: "<div>{{layui.util.toDateString(d.productdate,'yyyy-MM-dd')}}</div>"},
            {title:"操作",align:'center',toolbar:'#barDemo',fixed:'right'}
          ]
        ]
      });

      //监听头部工具栏
      table.on('toolbar(main-table)',function (obj) {
        switch (obj.event) {
          case 'add':
            layer.open({
              type:2,
              title:'新增药品信息',
              content:"/drugInfo/add",
              shade:[0.8,'#393d49'],
              area:['800px','600px'],
              btn:['确定','取消'],
              yes:function (index,layero) {
                //var ifname="layui-layer-iframe"+index;//获得layer层的名字
                var iframeWindow = window['layui-layer-iframe'+index];
                //根据id获取子页面按钮
                var submit = layero.find('iframe').contents().find("#LAY-front-submit");
                //监听提交
                //data传到后台
                iframeWindow.layui.form.on('submit(LAY-front-submit)',function (data) {
                  var field = data.field;
                  $.ajax({
                    url:'/drugInfo/drugInfoAdd',
                    data:field,
                    async:false,
                    cache:false,
                    success:function (str) {
                      if (str.code == 1){
                        table.reload('table-load');
                      }
                      layer.msg(str.msg,{icon:str.icon,anim:str.anim})
                    }
                  });
                  layer.close(index); //关闭弹出层
                });
                submit.trigger('click');
              },
              success:function (layero, index) {

              }
            });
            break;
          case 'querySearch':
            var param = $("#param").val();
            table.reload('table-load',{
              where:{
                param:param
              }
            });
            $('#param').val(param);
            break;
        }
      })

      //监听编辑和删除
      table.on('tool(main-table)',function (obj) {
        console.log(obj);
        var data = obj.data;
        console.log(data);
        switch (obj.event) {
          case 'edit':
            layer.open({
              type:2,
              title:'编辑药品信息',
              content:"/drugInfo/edit?id="+data.id,
              shade:[0.8,'#393d49'],
              area:['800px','600px'],
              btn:['确定','取消'],
              yes:function (index,layero) {
                //var ifname="layui-layer-iframe"+index;//获得layer层的名字
                var iframeWindow = window['layui-layer-iframe'+index];
                //根据id获取子页面按钮
                var submit = layero.find('iframe').contents().find("#LAY-front-submit");
                //监听提交
                //data传到后台
                iframeWindow.layui.form.on('submit(LAY-front-submit)',function (data) {
                  var field = data.field;
                  $.ajax({
                    url:'/drugInfo/drugInfoEdit',
                    data:field,
                    async:false,
                    cache:false,
                    success:function (str) {
                      if (str.code == 1){
                        table.reload('table-load');
                      }
                      layer.msg(str.msg,{icon:str.icon,anim:str.anim})
                    }
                  });
                  layer.close(index); //关闭弹出层
                });
                submit.trigger('click');
              },
              success:function (layero, index) {

              }
            });
            break;
          case 'del':
            layer.confirm("确定要删除吗?",function (index) {
              $.ajax({
                url:'/drugInfo/drugInfoDel?id='+data.id,
                data:null,
                async:false,
                cache:false,
                success:function (str) {
                  if (str.code == 1){
                    table.reload('table-load');
                  }
                  layer.msg(str.msg,{icon:str.icon,anim:str.anim})
                }
              });
            });
            break;
        }
      })


    });
  </script>
</body>
</html>